body{
  margin:0;
  width:100%;
  overflow-x:hidden;
}
#bg{
  background-image: url(../images/bk_quiet.jpg);
  background-position: center center;
  margin: auto;
  box-sizing: border-box;
}
#clown_bg{ 
  background-image: url(../images/body_with_foot.png); 
  width:800px; 
  height:600px;
  position:relative;
  margin:auto;
}
#clown_bg.reflection{
  background-image: url(../images/body.png); 
  -webkit-box-reflect: below -118px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0.8, transparent), to(rgba(255, 255, 255, 0.5)));
  -webkit-box-reflect: below -118px -webkit-linear-gradient(top, transparent, transparent 80%, rgba(255, 255, 255, 0.5));
}
#feet {
  display: none;
}
.reflection  #feet {
  display: block;
}
#out_box{
  width:140px; 
  height:134px; 
  position:absolute;
  z-index:300;
  top:224px; 
  left:338px;
}
#hat{
  width:153px;
  height:80px;
  position:absolute;
  z-index:400;
  top:159px;
  left:348px;
  -webkit-transform: rotate(10deg);
     -moz-transform: rotate(10deg);
       -o-transform: rotate(10deg);
          transform: rotate(10deg);
  
}

.gradient{
  background-image: -webkit-gradient(radial,77 40, 0, 77 40, 94, from(white), color-stop(0.1, white), color-stop(0.6, #F2F2F2), to(#C2C2C2));
  background-image: -webkit-radial-gradient(77px 40px, circle farthest-side, white, white 20px, #F2F2F2 33px, #C2C2C2 100px);
  background-image:    -moz-radial-gradient(77px 40px, circle farthest-side, white, white 20px, #F2F2F2 33px, #C2C2C2 100px);
  background-image:         radial-gradient(77px 40px, circle farthest-side, white, white 20px, #F2F2F2 33px, #C2C2C2 100px);
}
#top_face{
  width:140px;
  height:67px;
  position:absolute;
  z-index:222;
  background-size:200px 200px;
  background-position:0px 0px;
  -webkit-border-top-left-radius: 70px 67px;
      -moz-border-radius-topleft: 70px 67px;
          border-top-left-radius: 70px 67px;
  -webkit-border-top-right-radius: 70px 67px;
      -moz-border-radius-topright: 70px 67px;
          border-top-right-radius: 70px 67px;
}
#down_face{
  width:140px;
  height:67px;
  position:absolute;
  z-index:111;
  top:67px;
  background-size:200px 200px;
  background-position:0px -67px;
  -webkit-border-bottom-left-radius: 70px 67px;
      -moz-border-radius-bottomleft: 70px 67px;
          border-bottom-left-radius: 70px 67px;
  -webkit-border-bottom-right-radius: 70px 67px;
      -moz-border-radius-bottomright: 70px 67px;
          border-bottom-right-radius: 70px 67px;
  }
#chin{
  height:67px;
}
#Ldown_face{
  width:70px;
  height:67px;
  position:absolute;
  top:23px;
  left:19px;
  background-size:200px 200px;
  background-position:0px -80px;
  -webkit-border-bottom-left-radius: 45px 50px;
      -moz-border-radius-bottomleft: 45px 50px;
          border-bottom-left-radius: 45px 50px;
  -webkit-transform-origin: 10px 10px;
     -moz-transform-origin: 10px 10px;
       -o-transform-origin: 10px 10px;
          transform-origin: 10px 10px;
  -webkit-transform: rotate(-30deg);
     -moz-transform: rotate(-30deg);
       -o-transform: rotate(-30deg);
          transform: rotate(-30deg);
}

#Rdown_face{
  width:70px;
  height:67px;
  position:absolute;
  top:23px;
  left:28px;
  background-size:200px 200px;
  background-position:0px -107px;
  -webkit-border-bottom-right-radius: 45px 50px;
      -moz-border-radius-bottomright: 45px 50px;
          border-bottom-right-radius: 45px 50px;
  -webkit-transform-origin: 70px 53px;
     -moz-transform-origin: 70px 53px;
       -o-transform-origin: 70px 53px;
          transform-origin: 70px 53px;
  -webkit-transform: rotate(30deg);
     -moz-transform: rotate(30deg);
       -o-transform: rotate(30deg);
          transform: rotate(30deg);
  overflow:hidden;
  }
#eyebrow, #eye{
  width:140px;
  height:60px;
  position:absolute;
  }

#left_eyebrow_box , #right_eyebrow_box{
  width: 60px;
  height: 13px;
  overflow: hidden;
  position: absolute;
  top: 12px;
}
#left_eyebrow_box {
  left: 10px;
}
#right_eyebrow_box {
  left: 74px;
}
#eyebrow_left, #eyebrow_right{
  width: 54px;
  height: 40px;
  border-top: 3px solid black;
  position:absolute;
  top:2px;
}
#eyebrow_left{
  -webkit-border-top-left-radius: 35px 40px;
      -moz-border-radius-topleft: 35px 40px;
          border-top-left-radius: 35px 40px;
  -webkit-border-top-right-radius: 27px 25px;
      -moz-border-radius-topright: 27px 25px;
          border-top-right-radius: 27px 25px;
}
#eyebrow_right{
  -webkit-border-top-left-radius: 27px 25px;
      -moz-border-radius-topleft: 27px 25px;
          border-top-left-radius: 27px 25px;
  -webkit-border-top-right-radius: 35px 40px;
      -moz-border-radius-topright: 35px 40px;
          border-top-right-radius: 35px 40px;
}

.eye1{
  height: 42px;
  width: 42px;
  position:absolute;
  z-index:15;
  top:24px;
  background-image: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 21, from(transparent), color-stop(0.97, transparent), color-stop(0.97, white), to(red));
  background-image: -webkit-radial-gradient(circle farthest-side, transparent 0%, transparent 97%, white 97%, red 100%);
  background-image:    -moz-radial-gradient(circle farthest-side, transparent 0%, transparent 97%, white 97%, red 100%);
  background-image:         radial-gradient(circle farthest-side, transparent 0%, transparent 97%, white 97%, red 100%);
  background-position: -21px -21px;
  background-size: 42px 42px;
  background-repeat: repeat;
  overflow:hidden;
}
.eye_left{
  float:left;
  left:16px;
}
.eye_right{
  float:right;
  right:16px;
}
.eyes1{
  width:22px;
  height:22px;
  position:absolute;
  z-index:15;
  left:10px;
  top:10px;
  -webkit-border-radius: 22px;
     -moz-border-radius: 22px;
          border-radius: 22px;
  background:-webkit-gradient(radial, 50% 50%, 0, 50% 50%, 11, color-stop(0.7, #d5d5d5), color-stop(1, #d5d5d5));
  background:-webkit-radial-gradient(50% 50%, circle farthest-side, #d5d5d5 70%, #d5d5d5 100%);
  background:   -moz-radial-gradient(50% 50%, circle farthest-side, #d5d5d5 70%, #d5d5d5 100%);
  background:        radial-gradient(50% 50%, circle farthest-side, #d5d5d5 70%, #d5d5d5 100%);
}
.eyes2{
  width:16px;
  height:16px;
  position:absolute;
  z-index:15;
  left:3px;
  top:3px;
  -webkit-border-radius: 16px;
     -moz-border-radius: 16px;
          border-radius: 16px;
  background:-webkit-gradient(radial, 70% 30%, 0, 70% 30%, 12, color-stop(0.2, #0072ff), color-stop(1, #000000));
  background: -webkit-radial-gradient(70% 30%, circle farthest-side, #0072ff 20%, #000000 100%);
  background:    -moz-radial-gradient(70% 30%, circle farthest-side, #0072ff 20%, #000000 100%);
  background:         radial-gradient(70% 30%, circle farthest-side, #0072ff 20%, #000000 100%);
}
#nose{
  height: 42px;
  width: 42px;
  position:absolute;
  top:43px;
  left:49px;
  -webkit-border-radius: 50px;
     -moz-border-radius: 50px;
          border-radius: 50px;
  background-image: -webkit-gradient(radial, 70% 35%, 0, 70% 35%, 28, from(#ffffff), color-stop(0.6, #ff0000), to(#880000));
  background-image: -webkit-radial-gradient(70% 35%, circle farthest-side, #ffffff 0%, #ff0000 60%, #880000 100%);
  background-image:    -moz-radial-gradient(70% 35%, circle farthest-side, #ffffff 0%, #ff0000 60%, #880000 100%);
  background-image:         radial-gradient(70% 35%, circle farthest-side, #ffffff 0%, #ff0000 60%, #880000 100%);
}
#Zygomatic{
  height:20px;
  position:absolute;
  top:62px;
}
.Zygomatic1{
  background:-webkit-gradient(radial, 70% 35%, 0, 70% 35%, 12, color-stop(0.2, #ff0000), color-stop(1, #b80000));
  background: -webkit-radial-gradient(70% 35%, circle farthest-side, #ff0000 20%, #b80000 100%);
  background:    -moz-radial-gradient(70% 35%, circle farthest-side, #ff0000 20%, #b80000 100%);
  background:         radial-gradient(70% 35%, circle farthest-side, #ff0000 20%, #b80000 100%);
}
#Zygomatic_left{
  width:20px;
  height:20px;
  position:absolute;
  left:7px;
}

#Zygomatic_right{
  width:20px;
  height:20px;
  position:absolute;
  left:113px;
}

#mouth{
  width:140px;
  height:67px;
  position:absolute;
  top:10px;
}
#mouth_left,#mouth_right{
  width:70px;
  height:auto;
  position:absolute;
  overflow:hidden;
}
#mouth_right{
  left:70px;
}
.mouth1{
  background-image:-webkit-gradient(radial, 50% 50%, 0, 50% 50%, 150, from(#ff0000), to(#880000), color-stop(0.35, #ff0000));
  background-image: -webkit-radial-gradient(50% 50%, circle farthest-side, #ff0000 35%, #880000 100%);
  background-image:    -moz-radial-gradient(50% 50%, circle farthest-side, #ff0000 35%, #880000 100%);
  background-image:         radial-gradient(50% 50%, circle farthest-side, #ff0000 35%, #880000 100%);
  background-size: 300px 300px;
}
#Lmouth{
  top:-20px;
  width:70px;
  height:65px;
  background-position:-150px -20px;
}

#Rmouth{
  top:-20px;
  width:70px;
  height:65px;
  background-position:-80px -20px;
}
.mouth2{
  background-image:-webkit-gradient(radial, 77 40, 0, 77 40, 260,
                                    from(white), to(#C2C2C2), color-stop(0.077, white), color-stop(0.127, #F2F2F2), color-stop(0.385, #C2C2C2));
  background-image:-webkit-radial-gradient(77px 40px, circle farthest-side, white, white 20px, #F2F2F2 33px, #C2C2C2 100px);
  background-image:   -moz-radial-gradient(77px 40px, circle farthest-side, white, white 20px, #F2F2F2 33px, #C2C2C2 100px);
  background-image:        radial-gradient(77px 40px, circle farthest-side, white, white 20px, #F2F2F2 33px, #C2C2C2 100px);
  background-size: 300px 300px;
}
#Lmouth1{
  position: absolute;
  top: 0;
  left: -10px;
  width: 70px;
  height: 60px;
  -webkit-border-bottom-left-radius: 20px 60px;
      -moz-border-radius-bottomleft: 20px 60px;
          border-bottom-left-radius: 20px 60px;
  background-position: -24px -40px;
}

#Rmouth1{
  position: absolute;
  top: 0;
  left: 10px;
  width: 70px;
  height: 60px;
  -webkit-border-bottom-right-radius: 20px 60px;
      -moz-border-radius-bottomright: 20px 60px;
          border-bottom-right-radius: 20px 60px;
  background-position: -35px -59px;
}

#lips{
  width: 38px;
  position: absolute;
  left: 51px;
  background: white;
  -webkit-box-shadow: 0px 2px 2px #ccc inset;
     -moz-box-shadow: 0px 2px 2px #ccc inset;
       -o-box-shadow: 0px 2px 2px #ccc inset;
          box-shadow: 0px 2px 2px #ccc inset;

}
#or1{
  width: 32px;
  height: 7px;
  border-bottom: 3px solid black;
  -webkit-border-bottom-left-radius: 16px 7px;
  -webkit-border-bottom-right-radius: 16px 7px;
  -moz-border-radius-bottomleft: 16px 7px;
  -moz-border-radius-bottomright: 16px 7px;
  border-bottom-left-radius: 16px 7px;
  border-bottom-right-radius: 16px 7px;
  position: absolute;
  top: 1px;
  left: 3px;
}
#oral{
  width: 26px;
  height: 32px;
  position: absolute;
  top: -8px;
  left: 6px;
  background: -webkit-gradient(radial, 70% 50%, 0, 70% 50%, 16, from(#0f0000), to(#5f0000));
  background: -webkit-radial-gradient(70% 50%, circle farthest-side, #0f0000 0%, #5f0000 100%);
  background:    -moz-radial-gradient(70% 50%, circle farthest-side, #0f0000 0%, #5f0000 100%);
  background:         radial-gradient(70% 50%, circle farthest-side, #0f0000 0%, #5f0000 100%);
}

#tongue{
  width: 20px;
  height: 0px;
  position: absolute;
  top: 20px;
  left: 3px;
  background: -webkit-gradient(radial, 70% 5%, 0, 70% 5%, 10, from(#ff0000), to(#880000));
  background: -webkit-radial-gradient(70% 5%, circle farthest-side, #ff0000 0%, #880000 100%);
  background:    -moz-radial-gradient(70% 5%, circle farthest-side, #ff0000 0%, #880000 100%);
  background:         radial-gradient(70% 5%, circle farthest-side, #ff0000 0%, #880000 100%);
}
#feet{
  position: absolute;
  width: 233px;
  height: 42px;
  top: 500px;
  left: 290px;
}
#left_foot{
  position: absolute;
  top: 0;
  left: 0;
  width: 111px;
  height: 42px;
  -webkit-transform-origin: 90% 0;
}
#right_foot{
  position: absolute;
  top: 0;
  left: 122px;
  width: 111px;
  height: 42px;
  -webkit-transform-origin: 10% 0;
}
#tips_icon{
  background-image: url(../images/show.png);
  width: 42px;
  height: 49px;
  position: absolute;
  top: 300px;
  right: 0;
}
#side_menu{
  width: 74px;
  position: absolute;
  right: -76px;
  top: 220px;
  -webkit-transition: right 0.6s ease-in-out;
  border: 2px solid rgba(190, 190, 190, 0.75);
  border-right: none;
  -webkit-border-top-left-radius: 16px;
      -moz-border-radius-topleft: 16px;
          border-top-left-radius: 16px;
  -webkit-border-bottom-left-radius: 16px;
      -moz-border-radius-bottomleft: 16px;
          border-bottom-left-radius: 16px;

}
.side_menu_icon {
  height: 46px;
  width: 46px;
  border: 3px solid rgba(255, 255, 255, 0.7);
  border-radius: 25px;
  margin: 12px auto;
  background-image: url(../images/icons.png);
  opacity: 0.6;
  -webkit-transform: scale(0.96);
}
.side_menu_icon:hover {
  opacity: 1;
  -webkit-transform: scale(1);
}
#stage_icon {
  background-position: -40px -173px;
}
#nonbg_icon {
  background-position: -38px -58px;
}
#crowd_icon {
  background-position: -39px -229px;
}
#music_icon{
  background-position: -40px -113px;
}
#stop_icon{
  background-position: -39px -340px;
}
